import React , { Component } from 'react';

const users = [
    {username:'jeff',age:21,gender:'man'},
    {username:'tomy',age:23,gender:'man'},
    {username:'lily',age:21,gender:'female'},
    {username:'lucy',age:21,gender:'female'}
];

class User extends Component{
    render(){
        const { user } = this.props;
        return (
            <div>
                <div>姓名：{user.username}</div>
                <div>年龄：{user.age}</div>
                <div>性别：{user.gender}</div>
            </div>
        );
    }
}

class UserList extends Component{
    render(){
        return (
            <div>
                {users.map((user,i)=><User key={i} user={user} />)}
            </div>
        );
    }
}

export default UserList;